@main-prefix: ~"@{prefix}-main";

.@{main-prefix}-container {
  width: 100%;

  .@{main-prefix}-image-editor {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    background: var(--ieditor-color-level-3);

    .@{main-prefix}-image {
      background: var(--ieditor-color-level-1);
    }

    .@{main-prefix}-image-update {
      position: absolute;
    }
  }


  .@{main-prefix}-unsupported {
    width: 100%;
    height: 100%;
    background: var(--ieditor-color-level-3);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;

    .@{main-prefix}-unsupported-logo {
      display: flex;
      font-size: 90px;
      color: var(--ieditor-color-level-5);
    }
  
    .@{main-prefix}-unsupported-text {
      display: flex;
      color: var(--ieditor-color-level-6);
      font-size: 30px;
    }
  }

  
}